﻿<script src="~/lib/vue/dist/vue.global.js"></script>
<link href="~/lib/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/lib/element-plus/dist/index.full.js"></script>
<script src="~/lib/axios/dist/axios.js"></script>
<div id="app">
	<table width="100%">
		<tr>
			<td>
				<p color="black">您正在做的业务是:人力资源--调动管理--调动登记</p>
			</td>
		</tr>
		<tr>
			<td align="right">
				<input type="button" value="提 交" v-on:click="TiJiao()" class="BUTTON_STYLE1">
                <input type="button" value="返 回" class="BUTTON_STYLE1" v-on:click="goBack()">
			</td>
		</tr>
	</table>
	
	<table width="100%" border="1" cellpadding=0 cellspacing=1
		   bordercolorlight=#848284 bordercolordark=#eeeeee
		   class="TABLE_STYLE1">
		<tr>
			<td class="TD_STYLE1">
				档案编号
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.humanId" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				姓名
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.humanName" class="aaa"></el-input>
			</td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				原一级机构
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.firstKindName" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				原二级机构
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.secondKindName" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				原三级机构
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.thirdKindName" class="aaa"></el-input>
			</td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				原职位分类
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.majorKindName" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				原职位名称
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.majorName" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				原薪酬标准
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.salaryStandardName" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				原薪酬总额
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="obj.salarySum" class="aaa"></el-input>
			</td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				新一级机构
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newfirst"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in firstoptions"
							   :key="item.ffkId"
							   :label="item.firstKindName"
							   :value="item.firstKindId+item.firstKindName"
							   v-on:click="firstClick(item.firstKindId)" />
				</el-select>
			</td>
			<td class="TD_STYLE1">
				新二级机构
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newsecond"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in secondoptions"
							   :key="item.fskId"
							   :label="item.secondKindName"
							   :value="item.secondKindId+item.secondKindName"
							   v-on:click="secondClick(item.secondKindId)" />
				</el-select>
			</td>
			<td class="TD_STYLE1">
				新三级机构
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newthird"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in thirdoptions"
							   :key="item.ftkId"
							   :label="item.thirdKindName"
							   :value="item.thirdKindId+item.thirdKindName" />
				</el-select>
			</td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				新职位分类
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newmajorKindName"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in majorKindNameoptions"
							   :key="item.ftkId"
							   :label="item.majorKindName"
							   :value="item.majorKindId+item.majorKindName"
							   v-on:click="majorKindNameClick(item.majorKindId)" />
				</el-select>
			</td>
			<td class="TD_STYLE1">
				新职位名称
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newmajorName"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in newmajorNameoptions"
							   :key="item.ftkId"
							   :label="item.majorName"
							   :value="item.majorId+item.majorName" />
				</el-select>
			</td>
			<td class="TD_STYLE1">
				新薪酬标准
			</td>
			<td class="TD_STYLE2">
				<el-select v-model="objX.newstandardName"
						   placeholder="请选择"
						   size="large"
						   class="aaa">
					<el-option v-for="item in standardNameoptions"
							   :key="item.ftkId"
							   :label="item.standardName"
							   :value="item.standardId+item.standardName"
							   v-on:click="newstandardNameClick(item.standardId)" />
				</el-select>
			</td>
			<td class="TD_STYLE1">
				新薪酬总额
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="objxg.newsalarySum" class="aaa"></el-input>
			</td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				登记人
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="objxg.register" class="aaa"></el-input>
			</td>
			<td class="TD_STYLE1">
				登记时间
			</td>
			<td class="TD_STYLE2">
				<el-input v-model="objxg.registTime" class="aaa"></el-input>
			</td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
			<td>&nbsp; </td>
		</tr>
		<tr>
			<td class="TD_STYLE1">
				调动原因
			</td>
			<td class="TD_STYLE2" colspan="8">
				<textarea v-model="objxg.changeReason" name="emajorRelease.majorDescribe" rows="4" cols="80" class="TEXTAREA_STYLE1"></textarea>
			</td>
		</tr>

	</table>
</div>
<script>
	const { createApp, ref, reactive, computed, watchEffect } = Vue;
	var app = createApp({
		setup() {
			const urlParams = new URLSearchParams(window.location.search);
			const rowData = JSON.parse(urlParams.get('rowData'));
			//初始化得值
			const obj = reactive({
				hufId: rowData.hufId,
				mchId: rowData.mchId,
				humanId: rowData.humanId,
				humanName: rowData.humanName,
				firstKindId: rowData.firstKindId,
				firstKindName: rowData.firstKindName,
				secondKindId: rowData.secondKindId,
				secondKindName: rowData.secondKindName,
				thirdKindId: rowData.thirdKindId,
				thirdKindName: rowData.thirdKindName,
				majorKindId: rowData.humanMajorKindId,
				majorKindName: rowData.humanMajorKindName,
				majorId: rowData.humanMajorId,
				majorName: rowData.hunmaMajorName,
				salaryStandardId: rowData.salaryStandardId,
				salaryStandardName: rowData.salaryStandardName,
				salarySum: rowData.salarySum,
			})
			
			//下拉列表绑定的字段
			let objX = reactive({
				newfirst: '',
				newsecond: '',
				newthird: '',
				newmajorKindName: '',
				newmajorName: '',
				newstandardName: '',
			})
			//修改数据的字段
			let objxg = reactive({
				mchId: '',
				newfirst: '',
				newfirstid: '',
				newsecond: '',
				newsecondid: '',
				newthird: '',
				newthirdid: '',
				newmajorKindName: '',
				newmajorKindNameid: '',
				newmajorName: '',
				newmajorNameid: '',
				newstandardName: '',
				newstandardNameid: '',
				register: '',
				registTime: '',
				changeReason: '',
				newsalarySum: '',
				checkReason: ''
			})
			const fetchData = () => {
				// 获取存储的res.data值
				const responseDataString = sessionStorage.getItem('User');
				if (responseDataString) {
					// 将存储的字符串转换回数组
					const responseDataArray = JSON.parse(responseDataString);

					// 现在您可以访问responseDataArray数组中的元素
					objxg.register = responseDataArray.uName;
				} else {
					console.log("未找到存储的值");
				}
			};
			fetchData();
			//获取当前时间
			objxg.registTime = ref(new Date().toLocaleString());

			// 如果你想要实时更新时间，可以使用watchEffect或setInterval
			watchEffect(() => {
				const interval = setInterval(() => {
					objxg.registTime = new Date().toLocaleString();
				}, 1000);
			});

			//下拉列表数据的绑定
			const firstoptions = ref();
			const secondoptions = ref();
			const thirdoptions = ref();
			const majorKindNameoptions = ref();
			const newmajorNameoptions = ref();
			const standardNameoptions = ref();

			axios.get('/CFFK/GetCFFK')
				.then(res => {
					firstoptions.value = res.data
				})
			function firstClick(fid) {
				console.info(fid)
				axios.get(`/GetCFSKById/${fid}`).then(response => {
					secondoptions.value = response.data
				}).catch(error => {
					console.error('Error fetching data:', error);
				});
			}
			function secondClick(tid) {
				console.info(tid)
				axios.get(`/GetCFTKById/${tid}`).then(response => {
					thirdoptions.value = response.data
				}).catch(error => {
					console.error('Error fetching data:', error);
				});
			}
			axios.get('/GetCMK')
				.then(res => {
					majorKindNameoptions.value = res.data
				})
			function majorKindNameClick(mknid) {
				console.info(mknid)
				axios.get(`/GetCMById/${mknid}`).then(response => {
					newmajorNameoptions.value = response.data
				}).catch(error => {
					console.error('Error fetching data:', error);
				});
			}
			axios.get('/GetSS')
				.then(res => {
					standardNameoptions.value = res.data
				})
			function newstandardNameClick(standardId) {
				console.info(standardId)
				axios.get(`/SelectSalarySum/${standardId}`).then(res => {
					objxg.newsalarySum = res.data.salarySum
				}).catch(error => {
					console.error('Error fetching data:', error);
				});
			}

			function TiJiao() {;
				objxg.mchId = rowData.mchId;
				objxg.newfirstid = objX.newfirst.substring(0, 2);
				objxg.newfirst = objX.newfirst.substring(2);
				objxg.newsecondid = objX.newsecond.substring(0, 2);
				objxg.newsecond = objX.newsecond.substring(2);
				objxg.newthirdid = objX.newthird.substring(0, 2);
				objxg.newthird = objX.newthird.substring(2);
				objxg.newmajorKindNameid = objX.newmajorKindName.substring(0, 2);
				objxg.newmajorKindName = objX.newmajorKindName.substring(2);
				objxg.newmajorNameid = objX.newmajorName.substring(0, 2);
				objxg.newmajorName = objX.newmajorName.substring(2);
				objxg.newstandardNameid = objX.newstandardName.substring(0, 17);
				objxg.newstandardName = objX.newstandardName.substring(17);
				console.info(rowData.hufId)

				axios.defaults.headers["Content-Type"] = "application/x-www-form-urlencoded";
                axios.post('/SalaryAsync', {
                    humanId: rowData.humanId,
                    zt: 3
                })
				axios.post('/RegisterMC/AddMC', {
					MchId: rowData.mchId,
					HumanId: rowData.humanId,
					HumanName: rowData.humanName,
					FirstKindId: rowData.firstKindId,
					FirstKindName: rowData.firstKindName,
					SecondKindId: rowData.secondKindId,
					SecondKindName: rowData.secondKindName,
					ThirdKindId: rowData.thirdKindId,	
					ThirdKindName: rowData.thirdKindName,
					MajorKindId: rowData.humanMajorKindId,
					MajorKindName: rowData.humanMajorKindName,
					MajorId: rowData.humanMajorId,
					MajorName: rowData.hunmaMajorName,
					SalarySum: rowData.salarySum,
					SalaryStandardName: rowData.salaryStandardName,
					SalaryStandardId: rowData.salaryStandardId,
					NewFirstKindId: objxg.newfirstid,
					NewFirstKindName: objxg.newfirst,
					NewSecondKindId: objxg.newsecondid,
					NewSecondKindName: objxg.newsecond,

					NewThirdKindId: objxg.newthirdid,
					NewThirdkindName: objxg.newthird,
					NewMajorKindId: objxg.newmajorKindNameid,
					NewMajorKindName: objxg.newmajorKindName,

					NewMajorId: objxg.newmajorNameid,
					NewMajorName: objxg.newmajorName,
					NewSalaryStandardId: objxg.newstandardNameid,
					NewSalaryStandardName: objxg.newstandardName,

					NewSalarySum: objxg.newsalarySum,
					Register: objxg.register,
					RegistTime: objxg.registTime,
					ChangeReason: objxg.changeReason,
					CheckReason: 1
				}).then(res => {
					if (res.data) {
						alert("调动成功")
						window.location.href = `/RegisterMC/Index`;
					}
				})

			}
            //返回
            function goBack() {
                history.back();
            }
			return {
				obj,
				objX,
				objxg,
				firstoptions,
				secondoptions,
				thirdoptions,
				majorKindNameoptions,
				newmajorNameoptions,
				standardNameoptions,
				firstClick,
				secondClick,
				majorKindNameClick,
				TiJiao,
				newstandardNameClick,
                goBack
			}
		}
	})
	app.use(ElementPlus);
	app.mount("#app");
</script>
<style type="text/css">
    body {
        background-color: #FFFFBB;
        border: 1px solid #FFDB6F;
        display: block;
        margin: 8px;
    }
</style>